* {
  box-sizing: border-box;
  margin: 0;
  outline: none;
  padding: 0;
}

html, body, #container {
  height: 100%;
}

.hidden {
  display: none;
}

.panel {
  background-color: #fafafa;
  border: solid 1px #ccc;
  border-radius: 2px;
  font-family: 'Arial', sans-serif;
  padding: 10px;
}

.djs-label {
  font-family: 'Arial', sans-serif;
}

.bpmn-icon-task.red {
  color: #cc0000 !important;
}

.bpmn-icon-task.yellow {
  color: #ffc800 !important;
}

.bpmn-icon-task.green {
  color: #52B415 !important;
}

#quality-assurance {
  color: #111;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
}

#quality-assurance #form input {
  border: solid 1px #ccc;
  border-radius: 2px;
  font-family: 'Arial', sans-serif;
  padding: 10px;
}

#quality-assurance #form input[type=text] {
  width: 100%;
}

#quality-assurance #form #warning {
  background-color: rgba(255, 0, 0, 0.25);
  border-radius: 2px;
  padding: 10px;
}

#quality-assurance #form input[type=submit] {
  background-color: #FAFAFA;
  color: #111;
}

#hint {
  bottom: 20px;
  left: 20px;
  position: absolute;
}